$(function () {
  // 点击“去注册按钮”，跳转到注册页面
  $('#link-reg').on('click', function () {
    // 注册页面显示
    $('.reg-box').show()
    // 登录页面隐藏
    $('.login-box').hide()
  })

  // 点击“去登录按钮”，跳转到登录页面
  $('#link-login').on('click', function () {
    // 登录页面显示
    $('.login-box').show()
    // 注册页面隐藏
    $('.reg-box').hide()
  })

  // 自定义校验功能
  layui.form.verify({
    // 用户名校验
    uname: [/^[a-zA-Z0-9]{5,12}$/, '用户名必须是5-12位数字和字母'],
    // 密码校验
    psw: [/^\S{6,15}$/, '密码必须是6-15位非空字符'],
    // 判断俩次密码是否一致功能
    repsw: function (value) {
    // 获取密码框内容
    const psw_v = $('.reg-box [name="password"]').val();
    if (value !== psw_v) {
      return '俩次密码不一致，请重新输入'
    }
  }
  })
  
  // 给注册表单注册监听事件
  $('.reg-box form').on('submit', function (e) {
    // 根据事件参数，阻止表单默认提交行为
    e.preventDefault()
    // 请求服务器数据
    axios.post('/api/reg', $(this).serialize()).then(function ({data:res}) {
      // 判断是否请求成功
      if (res.code === 0) {
        layer.msg('注册成功，请登录')
        // 利用点击事件，返回登录页面
        $('#link-login').click()
      } else {
        layer.msg(message.res)
      }
    })
  })
  // 给登录表单注册监听事件
  $('.login-box form').on('submit', function (e) {
    // 阻止表单默认提交行为
    e.preventDefault()
    // 请求服务器数据
    axios.post('/api/login', $(this).serialize()).then(function ({data:res}) {
      // 判断是否登录成功
      if (res.code === 0) {
        layer.msg('登录成功！')
        // 登录成功后，将数据保存到本地存储，方便以后，调用有权限的接口
        localStorage.setItem('token', res.token)
        // 登录成功后，跳转页面
        location.href = '/index.html'
      } else {
        layer.msg('账号或密码不正确，登录失败')
        // 登录失败，清空本地存储的登录数据
        localStorage.removeItem('token')
      }
    })
  })  
})